import { Component } from "react";

class Chapter6 extends Component {
    constructor(props) {
        super(props);
        this.state = {
            counts: 1,
        };
        this.increment = this.increment.bind(this);
    }
    increment() {
        this.setState(
            ({ counts }) => {
                return {
                    counts: counts + 1,
                };
            },
            () => {
                console.log(this.state.counts);
            }
        );
    }
    render() {
        const { title } = this.props;
        return (
            <div className='wrapper wrapper6'>
                <div className='page-header'>
                    <h3>{title}</h3>
                </div>
                <div className='page-content'>
                    <div className='alert alert-danger'>
                        当前counts的值为：{this.state.counts}
                    </div>
                    <button
                        className='btn btn-default'
                        onClick={this.increment}
                    >
                        增加
                    </button>
                </div>
            </div>
        );
    }
}

export default Chapter6;
